<!--
 * @Author: 灰灰
 * @Date: 2021-12-30 11:47:34
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2022-01-07 19:21:35
 * @Description: Echart 相关配置
-->
<template>
  <el-row :gutter="10">
    <el-divider>折线-柱状图</el-divider>
    <echart-view :needImg="needImg"
                 :option="chartOption"></echart-view>
  </el-row>
</template>

<script>
import chartMixin from '@/mixins/echartMixins/baseChartOption'
export default {
  name: 'echart',
  mixins: [chartMixin],
  props: {
    needImg: {
      type: Boolean,
      default: false
    }
  },
  data () {
    return {
    }
  },
  mounted () {
    setTimeout(() => {
      this.loadData()
    }, 1000);
  },
  methods: {
    loadData () {
      this.configLegend({
        data: ['line']
      })
      this.configXAxis({ data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] });
      this.configDataZoom({
      }, 'inside')
      const seriesLine = this.generateLineData({
        name: 'line',
        data: [150, 230, 224, 218, 135, 147, 260]
      });
      const seriesBar = this.generateBarData([150, 230, 224, 28, 35, 147, 26])
      const seriesBar2 = this.generateBarData([50, 20, 22, 28, 85, 47, 79])
      const series = [seriesLine, seriesBar, seriesBar2];
      this.configSeries(series);
    }
  }
}
</script>

<style>
</style>